<template>
  <div class="b1">
    <h2>A1组件</h2>
    <div>我的车:{{ car }}</div>
    <button @click="send1">把车借给兄弟开</button>
    <button @click="send2">把车给上层开</button>

    <ChildCom />
  </div>
</template>
  
<script setup>
import { inject, ref } from "vue";
import ChildCom from "./ChildCom.vue";

const car = ref("迈巴赫🚗");
const emitter = inject("emitter");
// 发送给兄弟组件
const send1 = () => {
  // emit发送事件
  emitter.emit("sendCar1", car);
};
// 发送给父组件
const send2 = () => {
  emitter.emit("sendCar2", car);
};
</script>
  
<style lang="scss" scoped>
.b1 {
  width: 400px;
  height: 400px;
  border: 2px solid green;
  margin-top: 50px;
}
</style>